<template>
  <div style="text-align: left">患者信息:
    <span style="font-size: 16px;background-color: beige;color: #42b983">
      姓名:{{info.realName}}
      病历号:{{info.caseNumber}}
      年龄:{{info.age}}
      性别:{{info.sex}}

  </span>
  </div>
  <hr/>
  <div style="text-align: left">在诊患者</div>
  <hr/>
  <div style="text-align: left">
    <el-form :inline="true" :model="formRecord">
      <el-form-item label="病历号">
        <el-input  placeholder="请输入患者病历号" clearable  v-model="formRecord.caseNumber"/>
      </el-form-item>
      <el-form-item label="患者姓名">
        <el-input  placeholder="请输入患者姓名" clearable v-model="formRecord.realName"/>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="getVisitedList">查询</el-button>
      </el-form-item>

    </el-form>
  </div>
  <hr/>
  <el-table :data="visitedList" style="width: 100%">
    <el-table-column prop="id" label="编号"  width="80px"/>
    <el-table-column prop="caseNumber" label="病历号" />
    <el-table-column prop="realName" label="患者姓名" />
    <el-table-column prop="cardNumber" label="身份证" width="230px"/>
    <el-table-column prop="visitState" label="看诊状态">
      <template #default="{row}">
        {{getState(row)}}
      </template>
    </el-table-column>
    <el-table-column prop="visitDate" label="挂号时间"/>
    <el-table-column label="操作" >
      <template #default="{ row }">
        <el-button type="primary" round @click="updateMedicalRecord(row)">更新病历</el-button>
      </template>

    </el-table-column>
  </el-table>
  <hr/>
</template>

<script setup>
//定义病人信息数据
import {onMounted, reactive, ref} from "vue";
import axios from "axios";

const info=reactive({
  realName:'',
  caseNumber:'',
  age:'',
  sex:''
});
//定义输出患者查询列表的表单
const formRecord=reactive({
  caseNumber:'',
  realName:''
});
//定义已经看诊患者列表
const visitedList=ref([]);
//定义分页总记录数
const total=ref();
onMounted(()=>{
  getVisitedList();
});

function getVisitedList(){
  axios.post("http://localhost/his/queryVisitedList",formRecord)
      .then((response)=>{
        //console.log(response);
        visitedList.value=response.data.visitedList;
        total.value=response.data.total;
      })
      .catch((error)=>{
        console.log(error);
      });
}
//定义函数处理接诊状态列的值
function getState(row){
  return row.visitState==2?'医生接诊':'';
}

/*实现病历更新*/
function updateMedicalRecord(row){
  info.caseNumber=row.caseNumber;
  info.realName=row.realName;
  info.sex=row.gender;
  info.age=row.age;
  //将病历号保持到sessionStorage对象
  sessionStorage.setItem("idKey",JSON.stringify({id:row.id}))
}
</script>

<style scoped>

</style>